<template>
    <div class="banners">
        <el-form-item label="背景图片" prop="imageId" :rules="rules1">
            <upload-file :picnum="picnum" @remove="removePic" @success="uploadSuccess" :limit="piclimit">
            </upload-file>
        </el-form-item>
        <p class="upload_text">仅可上传一个文件（视频/音频），视频仅支持MP4，音频仅支持MP3，音/视频大小不得超过2G.</p>
    </div>
</template>
<script>
/**
* description: 锦旗模块
*/
import uploadFile from '../upload/upload.vue'
export default {
    components: {
        uploadFile,
    },
    data() {
        return {
            picnum: 0, //一个页面可能会有几个upload组件，需要编号
            piccontent:[],
            rules1: [
                { required: true, message: '内容不能为空' },
                { type: 'string', message: '' }
            ],
        }
    },
    methods:{
        removePic(picnum, file, fileList) {
            this.uploadForm.forEach((item) => {
                item.picnum === picnum ? item.piccontent = fileList : ''
            })
        },
        uploadSuccess(picnum, file, fileList) {
            this.uploadForm.forEach((item) => {
                item.picnum === picnum ? item.piccontent = fileList : ''
            })
        },
        submit() {
            // todo 提交数据给后端
        },
        addForm() {
            this.uploadForm.push({
                picnum: ++PICNUM,
                piccontent: [],
                desc: ''
            });
            console.log(this.uploadForm)
        }
    }
}
</script>
<style lang="scss" scoped>
.upload_text {
    font-size: 12px;
    font-family: MicrosoftYaHei;
    color: #999999;
    line-height: 16px;
    margin: -8px 0 28px 54px;

}
</style>